<template>
  <div>
    <el-dialog v-model="dialogFormVisible" :before-close="closeDialog" v-on:open="loadSite" :close-on-click-modal="false">
      <!--列表主体 start-->
      <el-table
        ref="multipleTable"
        :data="page.list"
        @selection-change="handleSelectionChange">
        <el-table-column
          type="selection"
          width="55">
        </el-table-column>
        <el-table-column
          type="index"
          label="序号"
          width="80">
        </el-table-column>
        <el-table-column
          prop="name"
          label="名称">
        </el-table-column>
        <el-table-column
          prop="address"
          label="地址">
        </el-table-column>
        <el-table-column
          prop="respo"
          label="负责人">
        </el-table-column>
        <el-table-column
          prop="telephone"
          label="手机">
        </el-table-column>
      </el-table>
      <!--列表主体 end-->
      <el-row :gutter="20">
        <el-col :span="16">
          <div>
            <el-pagination
              @size-change="handleSizeChange"
              @current-change="handleCurrentChange"
              :current-page="page.pageNumber"
              :page-sizes="[10, 20, 30]"
              :page-size="10"
              layout="total, prev, pager, next, jumper"
              :total="page.totalRow">
            </el-pagination>
          </div>
        </el-col>
        <el-col :span="8">
          <div>
            <el-button type="primary" @click.native.prevent="handleSubmit">确定</el-button>
            <el-button @click.native="closeDialog">取消</el-button>
          </div>
        </el-col>
      </el-row>
    </el-dialog>

  </div>
</template>

<script>
  import http from '../../../api/http'
  export default {
    data () {
      return {
        page: {},
        form: {
          pageNo: 1,
          pageSize: 10
        },
        multipleSelection: []
      }
    },
    props: {
      dialogFormVisible: {
        type: Boolean,
        default: false
      },
    },
    computed: {
    },
    methods: {
      closeDialog(){
        this.$parent.closeSitesDialog();
      },
      loadSite () {
        var vm = this
        vm.loading = true
        http.postData(vm, "/pt/site/page",{
          pageNo: vm.form.pageNo,
          pageSize: vm.form.pageSize
        }, function (resp) {
          var ret = resp.body;
          if (ret.code == '111') {
            vm.page = ret.value;
          }
          vm.loading = false;
        });
      },
      handleSizeChange () {
        this.form.pageNo = 1
        this.loadSite()
      },
      handleCurrentChange (val) {
        this.form.pageNo = val
        this.loadSite()
      },
      handleSelectionChange (val) {
        this.multipleSelection = val
      },
      handleSubmit() {
        var vm = this;
        if (vm.multipleSelection.length) {
          vm.$parent.selectedSites(vm.multipleSelection);
          vm.$refs.multipleTable.clearSelection();
          vm.closeDialog();
        } else {
          vm.$message.error('没有勾选项,请确认您的选择')
        }
      }
    },
    components: {},
    created () {
    }
  }
</script>
<style>
</style>

